<template>
<view class="detail">
	<cu-custom bgColor="bg-gradual-blue" :isBack="true">
		<block slot="backText">返回</block>
		<block slot="content">订单详情</block>
	</cu-custom>	
	<pay-list @on-line="lineCreate" @close-pay="show = false" :show="show" :packageTag="packageTag" :params="params" :pid="pid" :payWay="payWay"></pay-list>
	<coupon-list :type="true" :list="coupon" :show="isCoupon" @on-close="isCoupon = false" @user-coupon="uCoupon"></coupon-list>
	<store-list :list="storeList" :show="vstore" @on-close="vstore = false" @on-select="selectStore"></store-list>
	<block v-if="!isVirtual">
		<view v-if="HasAddr" :class="['address', { readonly: isCreate }]" @tap="selectAddr">
			<view class="people">
				<text>{{ addr.name }}</text><text>{{ addr.phone }}</text>
			</view>		
			<view class="info"><text v-if="addr.is_default">默认</text>{{ addr.location_p+addr.location_c+addr.location_a+' '+addr.address }}</view>
			<image src="/static/separator.png"></image>
		</view>		
	</block>
	<view class="list">
		<block v-if="shop.type === 5">
			<view class="head"><text class="lg text-black icon-shopfill"></text>{{ title }}商城</view>
			<view class="item" v-for="(item, i) in list" :key="i">
				<image :src="item.default_imgurl"></image>
				<view class="desc">
					<view class="title"><text>{{ item.pname }}</text></view>
					<view class="attr_name">{{ item.prope }}</view>
					<view class="price">
						<text><text class="m text-price">{{ item.now_price }}</text></text>
						<text>x{{ item.rcount }}</text>
					</view>				
				</view>
			</view>			
		</block>
		<block v-else-if="shop.type === 1">
			<view class="shop" v-for="(m, idx) in list" :key="idx">
				<view class="head"><text class="lg text-black icon-shopfill"></text> {{ m.shop.shop_name }}</view>
				<view class="item" v-for="(item, i) in m.list" :key="i">
					<image :src="item.default_imgurl"></image>
					<view class="desc">
						<view class="title"><text>{{ item.name }}</text></view>
						<view class="attr_name">{{ item.prope }}</view>
						<view class="price">
							<text><text class="m text-price">{{ item.now_price }}</text></text>
							<text>x{{ item.rcount }}</text>
						</view>				
					</view>
				</view>					
			</view>
		</block>
	</view>
	<view class="excess">
		<view class="express" v-if="buy !== 2 && shop.type === 5">
			<view>配送方式</view>
			<view>快递</view>
		</view>
		<view v-if="shop.type === 1" @tap="showWay">
			<view>选择配送方式</view>
			<view class="showCoupon">
				<view class="coupon">{{ buy_style }}</view>				
				<image src="/static/more.png"></image>
			</view>
		</view>			
		<view class="needInt" v-if="needScore">
			<view>需要积分<text class="score">{{ needScore }}</text></view>
			<view>可用积分<text class="score">{{ userScore }}</text></view>
		</view>
		<view class="freight" @tap="showStore" v-if="pickup">
			<view>选择门店自提</view>
			<view><text>{{ store.name }}</text><image src="/static/more.png" v-if="!isCreate"></image></view>
		</view>	
		<view @tap="isCoupon = true" v-if="coupon.length">
			<view>优惠券</view>
			<view class="showCoupon">
				<view class="coupon" v-if="selectCoupon">
					<view>
						<image src="/static/c.png"></image>
						<text>满{{ selectCoupon.need !== -1 ? selectCoupon.need : '任意金额' }}减{{ selectCoupon.MaxMoney }}</text>
						<image src="/static/c_b.png"></image>
					</view>
				</view>				
				<image src="/static/more.png"></image></view>
		</view>		
		<view class="shopMoney" v-if="offsetprice.numprice">
			<view>购物币抵扣<text class="m text-price">{{ currencyDis }}</text></view>
			<switch class='red' :disabled="isCreate" @change="isCurrency = $event.detail.value" :class="isCurrency ? 'checked' : ''" :checked=" isCurrency ? true : false"></switch>
		</view>
		<view class="message">
			<view>买家留言：</view>
			<input type="text" :disabled="isCreate" v-model="remark" placeholder="留言建议提前协商(50字以内)">
		</view>
	</view>
	<view class="total">
		<view>
			<view>
				<view>商品总额</view>
				<view><text class="s b">&yen;</text><text class="m b">{{ total }}</text></view>
			</view>
			<view>
				<view>运费</view>
				<view><text class="x">+</text><text class="s">&yen;</text><text class="m">{{ freight }}</text></view>
			</view>
			<view v-if="isCurrency">
				<view>购物币</view>
				<view><text class="x">-</text><text class="s">&yen;</text><text class="m">{{ currencyDis }}</text></view>
			</view>
			<view v-if="offsetprice.offsetMoney">
				<view>积分抵扣</view>
				<view><text class="x">-</text><text class="s">&yen;</text><text class="m">{{ integral }}</text></view>
			</view>
			<view v-if="selectCoupon.MaxMoney">
				<view>优惠券</view>
				<view><text class="x">-</text><text class="s">&yen;</text><text class="m">{{ selectCoupon.MaxMoney }}</text></view>
			</view>
			<view v-if="favourable > 0">
				<text>优惠</text>
				<text class="text-red text-bold text-df">-<text class="text-price">{{ favourable }}</text></text>
			</view>
		</view>
	</view>
	<view class="tool">
		<view class="text-price text-bold text-red text-xl">{{ finalPrice }}</view>
		<view @tap="submit">去支付</view>
	</view>
</view>
</template>

<script>
	import PayList from '@/components/payList'
	import CouponList from './components/couponlist';
	import StoreList from './shop'
	import { mapGetters } from 'vuex'
	import { giftSettlement, createPackage } from '@/common/api/lbt'
	import { onLineCreate } from '@/common/api/shop'
	import { getSendMoney, getFullCut, JuriSdi, UserCoupon, PrivateStore, CreteOrder, ScoreSelect } from '@/common/api/users'
	export default {
		name: 'create',
		data () {
			return {
				SendWay: ['配送上门', '到店自提'],
				buy_style: '',
				packageTag: 0, // 大礼包购买进入方式
				payWay: 0, // 是否是大礼包订单
				isCoupon: false, // 是否显示优惠券
				selectCoupon: 0, // 选择的优惠券
				coupon: [], // 可用优惠券列表
				pid: '', // 购买商品ID集合
				HasAddr: true, // 是否有收获地址
				buy: 0, // 0表示从商品详情购买，1表示从购物车购买, 2表示大礼包
				isCreate: false, // 订单是否创建
				batchcode: '', // 订单号
				addr: {}, // 选择的收货地址
				userScore: 0, // 用户积分
				list: [], // 购买的商品
				show: false, //支付方式
				freight: 0, // 运费
				favourable: 0, // 优惠价
				vstore: false, // 显示门店列表
				storeList: [], // 门店列表
				store: {}, //选择的门店
				isCurrency: false, // 是否使用购物币
				remark: '', // 买家留言
				offsetprice: {}, //
				package_id: '', //大礼包ID
				pickup: 0 // 是否显示门店
			}
		},
		onShow () {
			this.getAddr()
			this.address.length ? this.HasAddr = true : this.HasAddr = false
		},
		methods: {
			submit () { // 提交订单
			   if (this.buy !== 2) {
				   if (this.shop.type === 5) {
					   this.shopOrder()   
				   } else if (this.shop.type === 1) {
					   this.onLineOrder()
				   }
			   } else {
				   this.packageOrder()
			   }
			},
			lineCreate (id) { // 线下商城订单创建
				   let json_data = []
				   this.list.forEach(item => {
					   let pro = []
					   item.list.forEach(k => {
						   let property_id = ''
						   let prope = ''
						   if (k.prope) prope = k.prope.replace(/\s/ig, '_')
						   if (k.property_id) property_id = k.property_id
						   pro.push([k.id, property_id, k.rcount, item.shop.id, prope, property_id])
					   })
                       json_data.push([item.shop.id, pro, this.remark, 0, '', item.shop.id, item.shop.shop_name])
				   })
				   const data = {
					   json_data: JSON.stringify(json_data),
					   pay_immed: 1,
					   pay_type: id === 4 ? 1 : id,
					   fromtype: 1,
					   add_keyid: this.addr.id,
					   user_currency: 0,
					   // #ifdef MP-WEIXIN
					   openid: this.userInfo.openid,
					   // #endif
					   buy_style: this.buy_style,
					   total_price: this.finalPrice,
					   appid: this.$appid
				   }
					onLineCreate(data, this.shop.customer_id).then(res => {
						let shopCart = uni.getStorageSync('ShopCart') || []
						if (id === 4 || id === 5) {
							 let provider = ''
							 id === 4 ? provider = 'wxpay' : provider = 'alipay'							
							// #ifndef MP-WEIXIN
								 uni.requestPayment({
									 provider: provider,
									 orderInfo: res.data,
									success: (res) => {
										if (this.buy === 1) {
											let list = uni.getStorageSync('ShopCart').map(item => {
												item.list = item.list.filter(k => !k.checked)
												return item
											}).filter(item => item.list.length)
											uni.setStorageSync('ShopCart', list) // 如果是购物车的产品，创建订单完成后清空购物车													
										} 
										uni.redirectTo({
											url: '/pages/orders/list?act=1',
										})
									},
									fail: err => {
										console.log(JSON.stringify(err))
									}
								 })
							// #endif
							 // #ifdef MP-WEIXIN
							 uni.requestPayment({
								 provider,
								 ...res.data,
								 success: r => {
									if (this.buy === 1) {
										let list = uni.getStorageSync('ShopCart').map(item => {
											item.list = item.list.filter(k => !k.checked)
											return item
										}).filter(item => item.list.length)
										uni.setStorageSync('ShopCart', list) // 如果是购物车的产品，创建订单完成后清空购物车													
									} 									
									uni.redirectTo({
										url: '/pages/orders/list?act=1',
									})
								 },
								 fail: er => {
									 console.log(er)
								 }
							 });
							 // #endif							
						} else {
							if (res.status === 1) {
								uni.showModal({
									content: res.msg,
									showCancel: false,
									success: () => {
										if (this.buy === 1) {
											let list = uni.getStorageSync('ShopCart').map(item => {
												item.list = item.list.filter(k => !k.checked)
												return item
											}).filter(item => item.list.length)
											uni.setStorageSync('ShopCart', list) // 如果是购物车的产品，创建订单完成后清空购物车				
										}						
										uni.redirectTo({
											url: '/pages/orders/list?act=1',
										})
									}
								})								
							} else if (res.status === 10006) {
								uni.showModal({
									content: res.msg,
									showCancel: false
								})
							}
						}
					})				
			},
			onLineOrder () {
				if (this.buy_style) {
					this.show = true
				} else {
					uni.showModal({
						content: '请选择配送方式',
						showCancel: false
					})
				}
			},
			packageOrder () { // 创建大礼包订单
			    let item = this.list[0]
				let _el = this.address.filter(item => this.addr.id === item.id)
				let phone = 0
				if (_el.length) phone = _el[0].phone 
				const data = {
					package_id: this.package_id,
					parent_id: item.parent_id,
					name: this.addr.name,
					phone: phone,
					location_p: this.addr.location_p,
					location_c: this.addr.location_c,
					location_a: this.addr.location_a,
					address: this.addr.address,
					totalprice: this.finalPrice,
					e_id: item.e_id,
					e_name: item.pname,
					add_id: this.addr.id, // 选择的地址ID
					store_id: '', // 选择门店的ID
					message: this.remark // 留言信息				
				}
				if (!this.isCreate) { // 订单是否已经创建完成
					uni.showLoading({ mask: true })
					createPackage(data).then(res => {
						uni.hideLoading()
						if (!res.code) {
							this.show = this.isCreate = true
							this.batchcode = res.data.batchcode							
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg,
								duration: 4000
							})
						}
					})
				} else {
					this.show = true
				}
			},
			shopOrder () { // 创建商城订单
				const data = {
					ticket: this.userInfo.ticket,
					address_id: this.addr.id,
					uname: this.userInfo.uname,
					total_price: this.finalPrice,
					totalscore: 0,
					cart: JSON.stringify(this.Cart),
					deductible_money: this.offsetprice.offsetMoney,
					sendMoney: this.freight,
					couponKeyid: 0,
					couponMoney: 0,
					sendstyle: this.store.name ? '自提' : '',
					store_id: this.store.id || '',
					storeName: this.store.name || '',
					is_collage_product: '',
					activitie_id: '',
					group_id: 0,
					openid: this.userInfo.openId || '',
					pay_currency: this.isCurrency ? +this.currencyDis : 0, //使用的购物币
					tolalMoney: this.finalPrice,
					storageData: '',
					deductible_integral: 0
				}
				if (!this.isCreate) { // 是否创建订单
				    uni.showLoading({ mask: true })
					CreteOrder(data).then(res => {
						uni.hideLoading()
						if (res.code === 400000) {
							this.show = this.isCreate = true
							this.batchcode = res.batchcode
							if (this.buy === 1) {
								let shopCart = uni.getStorageSync('ShopCart') || []
								uni.setStorageSync('ShopCart', shopCart.filter(item => !item.checked)) // 如果是购物车的产品，创建订单完成后清空购物车
							}
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 4000
							})
						}
					})					
				} else {
					this.show  = true
				}				
			},
			selectAddr () { // 如果订单没有创建就可以选择地址
				if (!this.isCreate) {
					uni.navigateTo({
						url: `/usercenter/address?type=${this.buy}&ad=1`
					})
				}
			},
			showWay () {
				uni.showActionSheet({
					itemList: this.SendWay,
					success: rst => {
						this.buy_style = this.SendWay[rst.tapIndex]
					}
				})
			},
			selectStore (e) { // 选择门店
				this.vstore = false
				this.store = e
			},
			async getData (id) { // 获取订单数据
				uni.showLoading()
				await this.getList(id)
				if (this.buy !== 2) {
					if (this.shop.type === 5) {
					  const data = {
							ticket: this.userInfo.ticket,
						}
					  await this.getFavourable(Object.assign({}, data, { product_info: JSON.stringify(this.list) }))						
					  await this.getPostMoney(Object.assign({}, data, { address_id: this.addr.id, product_info: JSON.stringify(this.list) }))
					  await this.getJuriSdi(Object.assign({}, data, { product_info: JSON.stringify(this.list) }))
					  await this.getCoupons(Object.assign({}, data, { op: 'use', coupon_type: 0 }))
					  await this.getStoreList(data)
					  await this.getScore(data)											
					}					
				}
				uni.hideLoading()
			},
			getList (package_id) { // 获取产品
			  if (this.buy !== 2) {
				if (this.shop.type === 5) {
					this.buy ? this.list = uni.getStorageSync('ShopCart').filter(item => item.checked) : this.list = uni.getStorageSync('items')
				} else if (this.shop.type === 1) {
					if (this.buy) {
						this.list = uni.getStorageSync('ShopCart').map(item => {
							item.list = item.list.filter(k => k.checked)
							return item
						}).filter(item => item.list.length)
					} else {
						this.list = uni.getStorageSync('items')
					}
 				}
				if (!this.buy && this.list[0].pay_type) this.pid = this.list[0].pid.toString()				  
			  } else {
				  return new Promise(resolve => {
					  giftSettlement({ package_id }).then(res => {
						  if (!res.code) {
							  let item = {}
							  item.default_imgurl = res.data.default_imgurl
							  item.pname = res.data.package_name
							  item.now_price = +res.data.price.replace(/,/ig, '')
							  item.rcount = 1
							  item.need_score = 0
							  item.pid = res.data.add_id
							  item.prope = ''
							  item.parent_id = res.data.parent_id
							  item.e_id = res.data.parent_id
							  this.list.push(item)
							  this.storeList = res.data.res_store
							  this.pickup = 1
							  resolve()
						  }
					  }).catch(err => {
						  uni.showModal({
							  content: '请稍后重试',
							  showCancel: false,
							  success: rst => {
								  uni.navigateBack()
							  }
						  })
					  })					  
				  })
			  }
			},
			getPostMoney (data) { // 获取运费
				return new Promise(resolve => {
					getSendMoney(data).then(res => {
						if (!res.code) this.freight = this.utils.Fxied(res.message.sendMoney)
						resolve()		
					})					
				})
			},
			getFavourable (data) { // 获取优惠价
				return new Promise(resolve => {
					getFullCut(data).then(res => {
						if (!res.code) this.favourable = res.message
						resolve()
					})
				})
			},
			getJuriSdi (data) {
				return new Promise(resolve => {
					JuriSdi(data).then(res => {
						res.offsetprice.numprice = +res.offsetprice.numprice
						this.offsetprice = res.offsetprice
						this.pickup = res.data.pickup
						resolve()
					})					
				})
			},
			getCoupons (data) { // 匹配商品可用优惠券
				return new Promise(resolve => {
					UserCoupon(data).then(res => {
						let pid = this.list.map(item => item.pid)
						this.coupon = res.coupon.filter(item => pid.includes(+item.connected_id) || +item.connected_id === -1).map(k => {
							let item = {}
							item.MaxMoney = +k.Money
							item.need = +k.NeedMoney
							item.NeedMoney = +k.NeedMoney === -1 ? '不限金额' : +k.NeedMoney
							item.coupon_id = k.keyid
							item.endtime = k.deadline
							item.nowtime = k.startline
							item.remark = k.p_content
							item.user_scene = k.c_content
							return item
						})
						resolve()
					})
				})
			},
			getScore (data) { // 用户积分
				return new Promise(resolve => {
					ScoreSelect(data).then(res => {
						if (!res.code) this.userScore = res.data
						resolve()
					})
				})
			},
			getStoreList (data) { // 获取门店列表
				return new Promise(resolve => {
					PrivateStore(data).then(res => {
						if (!res.code) this.storeList = res.data
						resolve()
					})
				})
			},
			uCoupon (coupon) { // 使用优惠券
			    let _coupon = Object.assign({}, coupon)
				_coupon.MaxMoney = this.utils.Fxied(_coupon.MaxMoney, 0)
				this.isCoupon = false
				this.selectCoupon = _coupon
			},
			getAddr () { // 获取收货地址
			   if (!this.isVirtual) { // 虚拟物品？
					if (this.address.length) {
						let addr
						let id = uni.getStorageSync('buyAddr', id)
						if (id) {
							addr = Object.assign({}, this.address.filter(item => item.id === id)[0])
						} else {
							addr = Object.assign({}, this.address.filter(item => item.is_default)[0])
							if (!addr || JSON.stringify(addr) === '{}') {
								addr = Object.assign({}, this.address[0])
							}
						}
						addr.phone = addr.phone.substr(0, 3) + '****' + addr.phone.substr(7) 
						this.addr = addr					
					} else {
						uni.showModal({
							content: '您还没有收货地址！',
							confirmText: '去添加',
							cancelText: '返回',
							success: rst => {
								if (rst.confirm) {
									uni.navigateTo({ url: `/usercenter/address?type=${this.buy}&ad=1` })
								} else {
									uni.navigateBack()
								}
							}
						})
					}				   
			   }
			},
			showStore () {
				if (!this.isCreate) this.vstore = true
			}
		},
		computed: {
			...mapGetters([
				'address',
				'shop',
				'userInfo',
				'navigator'
			]),
			title () {
				return this.navigator.title
			},			
			currencyDis () { // 购物币优惠价
				return  JSON.stringify(this.offsetprice) === '{}' ? 0 : this.offsetprice.numprice
			},
			total () { // 总价格
			   let price = 0
			   let list = []
			   if (this.shop.type === 5) {
			     list = this.list				   
			   } else if (this.shop.type === 1) {
				 list = this.list.reduce((total, item) => total.concat(item.list), [])
			   }
			    price = list.reduce((total, item) => this.utils.accAdd(total, this.utils.accMul(item.now_price, item.rcount)), 0)
				return this.utils.Fxied(price)
			},
			integral () { // 积分抵扣价格
				return JSON.stringify(this.offsetprice) === '{}' ? 0 : this.offsetprice.offsetMoney
			},
			needScore () { // 需要的总积分
				if (this.shop.type === 5) {
					return this.Cart.reduce((total, item) => this.utils.accAdd(total, item.need_score), 0)
				}
				return 0
			},
			finalPrice () { // 最终需要支付的价格
			    let price = 0
			    if (this.shop.type === 5) {
					price = this.utils.accSub(this.utils.accAdd(+this.total, +this.freight), +this.integral)
					price = this.utils.accSub(price, +this.favourable) // 减去优惠的价格
					if (this.isCurrency) price =  this.utils.accSub(price, +this.currencyDis) // 减去购物币优惠价
					if (this.selectCoupon) price = this.utils.accSub(price, this.selectCoupon.MaxMoney) // 减去优惠券优惠的价格					
				} else if (this.shop.type === 1) {
					price = this.total
				}
				return this.utils.Fxied(price)
			},
			isVirtual () { // 虚拟物品? true --是的， false不是
				if (this.shop.type === 5 && this.list.length) {
					return !this.buy && this.list[0].is_virtual === 1
				} 
				return false
			},
			params () { // 支付参数
				return Object.assign({}, { batchcode: this.batchcode, total_price: this.finalPrice })
			},
			Cart () {
				if (this.shop.type === 5) {
					return this.list.map(item => {
						let data = {
						  pid: item.pid,
						  supply_id: item.supply_id,
						  pname: item.pname,
						  property_id: item.property_id,
						  prope: item.prope,
						  rcount: item.rcount,
						  totalprice: this.utils.accMul(item.now_price, item.rcount),
						  price: item.now_price,
						  need_score: this.utils.accMul(item.need_score, item.rcount),
						  come_type: 1,
						  remark: this.remark, //购物留言
						  renew_id: item.renew_id,
						  decrease_money: item.decrease_money, //满减多少钱
						  is_virtual: item.is_virtual, //是否是虚拟产品
						  extend_money: item.extend_money							
						}
						return data
					})					
				} else if (this.shop.type === 1) {
					return []
				}
				return []
			}
		},
		onLoad (opt) {
			this.buy = +opt.type
			this.packageTag = opt.tag ? +opt.tag : 0
			if (opt.package_id) {
				this.package_id = opt.package_id // 大礼包ID
				this.payWay = 1
			}
			this.getData(opt.package_id)
		},
		watch: {
			finalPrice (val, oldval) {
				if (this.selectCoupon) {
					if (+val + this.selectCoupon.MaxMoney > +this.selectCoupon.need) {
						if (+val < +this.selectCoupon.MaxMoney ) {
							this.selectCoupon = 0
							uni.showToast({
								icon: 'none',
								duration: 4000,
								title: '优惠券金额不能大于订单总金额'
							})
						}
					} else {
						this.selectCoupon = 0
						uni.showToast({
							icon: 'none',
							duration: 4000,
							title: '订单金额不满足优惠券条件'
						})					
					}					
				}
			}
		},
		components: { PayList, StoreList, CouponList }
	}
</script>

<style lang="less" scoped>
@import '../../common/styles/variables.less';
.box-shadow {
	box-shadow: 0 0 10px @sliver;
	background-color:white;
}
.s, .m, .x, .score{ font-weight: 600;color:@red}
.s { font-size:@minSize;padding:0 6upx; &.b { color:black }}
.m { &.b { color:black } }
.x { margin-right: 0; }
.score { color:#009688;margin-left: 6upx  }
.detail {
	padding: 20upx 0 108upx;
	.address {
		padding: 20upx 15upx;
		margin: 0 15upx 20upx;
		&.readonly { position: relative; }
		&:not(.readonly) { .arrowRight(black, 30upx, 15upx); }
		.box-shadow;
		.people {
			text { 
				font-weight: 600;
				font-size:@title;
				&:last-of-type {
					padding-left: 40upx;
				}
			 }
		}
		.info {
			font-size:@minSize;
			color:@gray;
			padding-top: 10upx;
			& > text {
				color:white;
				background-color:@red;
				padding: 4upx 20upx;
				border-radius: 20upx;
				margin-right: 10upx;
			}
		}
		& > image {
			position: absolute;
			width: 100%;
			left: 0;
			bottom: 0;
			height: 2px;
		}
	}
	.list {
		.box-shadow;
		margin: 0 15upx 20upx;
		.head {
		    padding: 0 15upx;			
			height: @height;
			font-size:@title;
			display: flex;
			align-items: center;
			.lg {
				font-size: 38upx;
				margin-right: 10upx;
			}
			.border-bottom;
			image {
				width: 36upx;
				height: 36upx;
				margin-right: 10upx;
				display: block;
			}			
		}
		.item {
			padding: 20upx 15upx;
			display: flex;
			align-items: flex-start;
			&:not(:last-of-type) { .border-bottom(15upx) }
			image {
				width: 150upx;
				height: 150upx;
				display: block;
			}
			.desc {
				flex: 1;
				display: flex;
				flex-direction: column;
				flex-flow: column;
				justify-content: space-between;
				margin-left: 20upx;
				.title { .twoLine(2) }
				.price {
					display: flex;
					justify-content: space-between;
					align-items: center;
					text {
						&:nth-of-type(1) {
							color:@red
						}
					}
				}
				.attr_name {
					font-size:@minSize;
					color:@gray;
				}
			}			
		}
	}
	.excess {
		.box-shadow;
		margin: 0 15upx 20upx;
		& > view {
			height: @height;
			display: flex;
			align-items: center;
			padding: 0 15upx;
			justify-content: space-between;
			&:not(:last-of-type) { .border-bottom(15upx); }
			&.message {
				input {
					flex: 1
				}
			}
			& > view {
				&.showCoupon {
					flex: 1;
					display: flex;
					justify-content: flex-end !important;
					align-items: center;
					.coupon {
						display: flex;
						margin-right: 10upx;
						& > view {
							display: flex;
							align-items: center;
							height: 34upx;
							box-sizing: border-box;
							border-top: 2upx solid @red;
							border-bottom: 2upx solid @red;
							& > text {
								font-size: @minSize;
								color: @red;
								padding: 0 14upx 0 10upx;
								transform: scale(0.9);
							}
							& > image {
								height: 34upx;
								display: block;
								margin-left: 0;
								&:first-of-type {
									width: 14upx;
								}
								&:last-of-type {
									width: 8upx;
								}
							}
						}
						& > view:not(:last-of-type) {
							margin-right: 20upx;
						}
					}
					.msg {
						font-size: @minSize;
						color: @gray;
					}
				}				
				&:last-of-type {
					display: flex;
					align-items: center;
					justify-content: space-between;
					image { 
						width: 38upx;
						height: 38upx;
						display: block;
						margin-left: 6upx
					}					
				}
			}
		}
	}
	.total {
		.box-shadow;
		margin: 0 15upx;
		& > view {
			padding: 20upx 15upx;
			& > view {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
		}
	}
	.tool {
		box-sizing: border-box;
		width: 100%;
		bottom: 0;
		left: 0;
		background-color:white;
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: @height;
		padding-left: 15upx;
		z-index: 666;
		.border-top(0, fixed);
		& > view {
			&:nth-of-type(2) {
				background-color:@red;
				color:white;
				height: 100%;
				display: flex;
				align-items: center;
				padding: 0 50upx;
			}
		}
	}
}
</style>
